<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            text-align: center;
        }
        svg{
           background: #aaa;
        }
    </style>
</head>
<body>
    <svg width="500" height="400">
        <rect x="235" y="399" width="30" height="1" fill="#faa" stroke="#800" fill-opacity="0.3" stroke-opacity="0.3" id="rect"></rect>
    </svg>
    <script>
        /**
         * 效果：一个柱子：定时器修改高度1--300
         */
        var height=rect.getAttribute(height);
        var timer=setInterval(function () {
            height+=1;
            rect.setAttribute("height",height);
            rect.setAttribute("y",400-height);
            if(height>=300){
                clearInterval(timer);
            }
        },13)

    </script>
</body>
</html>